<template>
  <mu-dialog
    :open.sync="open"
    @click="close"
    class="mu-dialog-popup"
    style="max-width:100%;"
  >
    <img :src="image" alt="图片" v-elevation="24" style="max-width:100%;max-height:90vh;" @click="close"/>
  </mu-dialog>
</template>
<script>
export default {
  name: 'ww-image-viewer',
  props: {
    eventName: {
      type: String,
      default: 'ww-image-view',
    },
  },
  data: function () {
    return {
      open: false,
      image: null,
      name: '',
    }
  },
  methods: {
    close () {
      this.open = false
      this.image = null
      this.name = ''
    },
  },
  created () {
    this.$bus.$on(this.eventName, (image, name) => {
      this.image = image
      this.open = true
      this.name = name || '图片'
    })
  },
}
</script>
<style lang="scss" scoped>
</style>
